<template>
	<el-submenu v-if="menu.children && menu.children.length > 0" :index="menu.href">
	  <template slot="title">
	    <i :class="menu.icon"></i>
	    <span slot="title">{{ menu.functionName }}</span>
	  </template>
	  <menuItem v-for="child in menu.children" :menu="child" :key="child.id"></menuItem>
	</el-submenu>
	<el-menu-item v-else :index="menu.href">
	  <i :class="menu.icon"></i>
	  <span slot="title">{{ menu.functionName }}</span>
	</el-menu-item>
</template>
<script>

export default {
  name:'menuItem',
  props:{
    menu: {
      required: true
    }
  }
}
</script>
